////
/// Components
/// NopeHandle
////

@import 'props';

.NopeHandle {
  position: relative;
  width: $handle-size;
  height: $handle-size;
  border: $handle-stroke-width solid currentColor;
  border-radius: 50%;
  transition: border-color get-duration(fast) get-easing();

  &::before {
    content: '';
    position: absolute;
    top: $handle-center - $handle-stroke-width;
    left: -($handle-stroke-width / 2);
    display: block;
    width: $handle-size - $handle-stroke-width;
    height: $handle-stroke-width;
    background-color: currentColor;
    transform: rotate(45deg);
  }
}
